<!-- 企业产值数热力图 -->
<template>
  <div class="content-heatmap">
    <div class="title"></div>
    <div class="minpng">
      <div class="pngtips"></div>
      <div class="hotmap"></div>
    </div>
  </div>
</template>

<script>
export default {
  name: "heatmap",
};
</script>

<style scoped>
.content-heatmap {
  background: url("~@/wood/images/patr-3.png")
    no-repeat;
  background-size: 100% 100%;
  height: 31.7vh;
  padding-top: 5%;
  
  
}
.content-heatmap .title {
    background: url("~@/wood/images/title3.png")
      no-repeat;
    background-size: 100% 100%;
    width: 51%;
    height: 13%;
    margin-left: 4%;
  }
  .content-heatmap .minpng {
    width: 100%;
    height:  calc(100% - 50px);;
    display: flex;
    justify-content: space-around;
    
  }

  .content-heatmap .minpng .pngtips {
      background: url("~@/wood/images/max.png")
        no-repeat;
      background-size: 100% 28%;
      background-position: bottom;
      width: 7%;
    }
    .content-heatmap .minpng .hotmap {
      background: url("~@/wood/images/热力图.png")
        no-repeat;
          background-size: 85% 85%;
    background-position: 24% 100%;
      width: 72%;
    }
</style>